<%@ page language="java" import="java.util.*" contentType="text/html"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>设置试卷</title>
	<script charset="utf-8" src='<c:url value="/js/jquery.min.js"></c:url>'></script>
	<style>
		html,body{
			margin: 0;
			padding: 0;
			font-family: "微软雅黑";
		}
		li{
			list-style: none;
		}
		a{
			text-decoration: none;
		}
		.Basic_course_content{
			width: 1920px;
			width: 100%;
		}
		.Basic_course_content_content{
			width: 1280px;
			margin: 0 auto;
		}
		.Basic_course_content_content_content{
			width: 780px;
 		    margin-left: 104px;
    		margin-top: 24px;
			text-align: left;
		}
		.Basic_course_content_content_content_title{
			color: #b8b8b8;
			font-size: 16px;
			padding-bottom: 1px;
			border-bottom: 2px solid #2459aa;
			font-weight: 800;
		}
		.Basic_course_content_content_content_title ul{
			padding:0;
			margin:10px;
		}
		.Basic_course_content_content_content_title li{
			display: inline-block;
			margin-right: 55px;
		}
		.Basic_course_content_content_content_title div{
			display: inline-block;
			height: 20px;
			width: 20px;
			border-radius: 50%;
			background: #b8b8b8;
		}
		.Basic_course_content_content_content_title li>div>span{
			color:white;
			z-index:1;
			position:relative;
			left:6px;
			top:-2px;
			font-weight:800;
			font-size:13px;
		}
		.Basic_course_content_content_content_content{
			padding: 25px 0;
		}
		.Basic_course_content_content_content_content>ul>li{
			padding: 16px 0;
		}
		.Basic_course_content_content_content_content>ul{
			margin: 0;
			padding: 0;
			margin-bottom: 16px;
		}
		.Basic_course_content_content_content_content>ul>li>div>span{
			/*float: left;*/
			font-size: 16px;
			padding: 4px 0;
		}
		.Basic_course_content_content_content_content>ul>li>div>span>font{
			color: #ff0000;
		}
		.Basic_course_content_content_content_content>ul>li>div>input{
			width: 420px;
			padding: 5px 0;
			padding-left: 5px;
		}
		.Basic_course_content_content_content_content>ul>li>div>select{
			padding: 5px 0;
			padding-left: 5px;
		}
		.Basic_course_content_content_content_content>ul>li>div>textarea{
			width: 420px;
			padding: 5px;
    		margin-top: 5px;
		}
		.Basic_course_content_content_content_content>ul>li>div>select>option{
			padding: 3px;
		}
		.Basic_course_baocun{
			width: 78px;
			height: 32px;
			text-align: center;
			background: #2459aa;
			color: #fff;
			font-size: 16px;
			line-height: 32px;
			border-radius: 3px;
			margin-left: 18px;
			display: inline-block;
			margin-right: 30px;
			cursor: pointer;
		}

		.fixedWidth{
			width: 22px;
		}
		.inlineDisplay{
			display: inline-block;	
		}


		/*以下是弹出框*/
		.select_course_type_content{
			z-index: 999;
			width: 430px;
			height: 565px;
			position: absolute;
			top: 130px;
			left: calc(50% - 215px);
			background:#fff;
			box-shadow: 0 0 3px #ccc;
			border-radius: 4px;
		}
		.select_course_type_content_header{
			width: 430px;
			height: 34px;
			background: #2b5eae;
			border-top-left-radius: 4px;
			border-top-right-radius: 4px;
		}
		.select_course_type_content_header img{
			border-top-right-radius: 4px;
		}
		.select_course_type_content,.select_course_type_content_header>span{
			font-size:14px;
			color:#fff;
			line-height:34px;
			margin-left:8px;
		}
		.cancel{
			width: 49px;
			height: 34px;
			float:right;
			cursor: pointer;
		}
		.select_course_type_content_content{
			/*text-align: center;*/
		}
		.select_course_type_content_content>span{
			line-height: 140px;
			font-size:16px;
			color:#2b5eae;
		}



		/*以下是表格*/
		.table{
			text-align: center;
			width: 100%;
		    margin: auto;
		    border-collapse: collapse;
			margin-bottom: 35px;
		}
		.table>thead>tr{
			height: 33px;
			font-weight: inherit;
			background: #82b4ee; 
			color: #fff;
		}

		.table>tbody>tr:nth-child(4){
			border-bottom: 2px solid #82b4ee;
		}
		.table td{
			width: 25%;
		    padding: 8px;
		    border-top: 1px solid #82b4ee;
		}
		.table>tbody>tr>td:nth-child(3)>input{
			width: 55px;
			height: 25px;
			margin-right: 10px;
			font-size: 16px;
			padding-left: 5px;
		}
		.table>tbody>tr>td:nth-child(4)>span:first-child{
			color: red;
			margin-right: 10px;
		}
		.table>tbody>tr:nth-child(5)>td{
			text-align: right;
			padding-right: 74px;
		}
		.table>tbody>tr:nth-child(5)>td>span:first-child{
			font-weight: bold;
			color:red;
			margin-right: 10px;
		}
		.top_trangle {
		    position: absolute;
		    width: 0px;
		    height: 0px;
		    line-height: 0px;
		    border-bottom: 8px solid #3F51B5;
		    border-left: 4px solid #ffffff;
		    border-right: 4px solid #ffffff;
		    margin-left: -25px;
    		margin-top: 6px;
    		cursor: pointer;
		}
		.bottom_trangle{
			position: absolute;
		    margin-left: -25px;
    		margin-top: 18px;
			width: 0px;
		    height: 0px;
		    line-height: 0px;
		    border-top: 8px solid #3F51B5;
		    border-left: 4px solid #ffffff;
		    border-right: 4px solid #ffffff;
		    cursor: pointer;
		}

	</style>
</head>
<body>
	<div class="Basic_course_content">
		<div class="Basic_course_content_content">
			<div class="Basic_course_content_content_content">
				<div class="Basic_course_content_content_content_title">
					<ul>
						<li>
							<div><span style="">1</span></div>
							<span>新建试卷</span>
						</li>
						<li>
							<div><span>2</span></div>
							<span>试卷组装</span>
						</li>
						<li style="color:#2459aa;">
							<div style="color:#2459aa;background:#2459aa;"><span>3</span></div>
							<span>设置试卷</span>
						</li>
					</ul>
				</div>
				<div class="Basic_course_content_content_content_content">
					<ul>
						<li>
							<div>
								<span><font>*</font> 合格成绩：</span>
								<input id="regular_grade" type="text" style="border: 1px solid #ccc;width:200px;"onkeyup="this.value=this.value.replace(/\D/g,'')"
									onafterpaste="this.value=this.value.replace(/\D/g,'')">
							</div>
						</li>
					</ul> 
					<table class="table table">
				    	<thead>
					        <tr>
					          <td>题型</td>
					          <td>题目数</td>
					          <td>每题分值</td>
					          <td>合计分值</td>
					        </tr>
					    </thead>
				      	<tbody id="Examination_details">
					        <tr>
					          	<td><span>单选题</span></td>
					          	<td><span id = "one" class="testnum"></span></td>
					          	<td><input id = "type_1" type="text" name="" readonly="readonly" value=0  class="eachscore"><span class="top_trangle" id="top_trangle1"></span><span class="bottom_trangle"></span><span>分</span></td>
					          	<td><span id="score1" class="onescore">0</span><span>分</span></td>
					        </tr>
					        <tr>
						        <td><span>多选题</span></td>
						        <td><span id="much" class="testnum"></span></td>
						        <td><input id = "type_2" type="text" name="" readonly="readonly" value=0  class="eachscore"><span class="top_trangle" id="top_trangle2"></span><span class="bottom_trangle"></span><span>分</span></td>
						        <td><span id="score2" class="onescore">0</span><span>分</span></td>
					        </tr>
					        <tr>
					          	<td><span>判断题</span></td>
					          	<td><span id = "judge" class="testnum"></span></td>
					          	<td><input id = "type_3" type="text" name="" readonly="readonly" value=0  class="eachscore"><span class="top_trangle" id="top_trangle3"></span><span class="bottom_trangle"></span><span>分</span></td>
					          	<td><span id="score3" class="onescore">0</span><span>分</span></td>
					        </tr>
					        <tr>
					          	<td><span>解答题</span></td>
					          	<td><span id = "solution" class="testnum"></span></td>
					          	<td><input id = "type_4" type="text" name="" readonly="readonly" value=0  class="eachscore"><span class="top_trangle" id="top_trangle4"></span><span class="bottom_trangle"></span><span>分</span></td>
					          	<td><span id="score4" class="onescore">0</span><span>分</span></td>
					        </tr>
					        <tr>
					        	<td colspan="4"><span id="allscore">0</span><span>分</span></td>
					        </tr>
				      	</tbody>
				    </table>
					<a class="Basic_course_baocun" href="javascript:save()">保存</a>
					<a class="Basic_course_baocun" href="javascript:last()">上一步</a>
					<!-- <a class="Basic_course_baocun" href="settingPaper.html">下一步</a> -->
					<a class="Basic_course_baocun" href="javascript:submit()">提交评估</a>
				</div>
			</div>
		</div>
	</div>
</body>
<script>
 	$(function(){
/*  		var testnum,eachscore,total;
		testnum = parseInt($(".testnum").text());
		console.log(testnum)
		eachscore = parseInt($(".eachscore").val());
		console.log(eachscore)
		total = testnum * eachscore;
		console.log(haha)
		$(".onescore").text(total); */
		calcuMark("#top_trangle1");
		calcuMark("#top_trangle2");
		calcuMark("#top_trangle3");
		calcuMark("#top_trangle4");
	});
	//加减分数
	var val,newval,num,persum,sum;
	$(".top_trangle").click(function(){
		val= parseInt($(this).parent().find("input").val());
		newval = val + 1;
		$(this).parent().find("input").val(newval);
		calcuMark(this);
	});
	$(".bottom_trangle").click(function(){
		val= parseInt($(this).parent().find("input").val());
		newval = val - 1;
		if (newval <= 0) {
			newval = 0;
		};
		$(this).parent().find("input").val(newval);
		calcuMark(this);
	});

	//计算分数
	function calcuMark(i){
		//单项分数
		num =  parseInt($(i).parent().prev().find("span").text());
		persum = newval*num;
		$(i).parent().next().children().eq(0).text(persum);
		//总分数
		sum = parseInt($("#score1").text()) + parseInt($("#score2").text()) + parseInt($("#score3").text()) + parseInt($("#score4").text());
		$("#allscore").text(sum);

	}
	var rootPath = '${rootPath}';
	var paperId = '${paperId}';
	var grading_way = "";
	$(function(){
		getInfor();
	});
	// 上一步
	function last(){
		save(function(){
			location.href = rootPath + "/testPaper/packages_r/"+ grading_way+"/" +paperId;
		})
	}
	
	function getInfor(){
		var url = rootPath + "/testPaper/paperInfo/"+paperId;
		$.ajax({
			url : url,
			method : "post",
			dataType : "json",
			data : {},
			success : function(data) {
				if (data) {
					if(data.isAuto == 1){
						grading_way = 'auto';
					}else{
						grading_way = 'hand';
					}
					showInfo(data);
				} else {
					alert("获取信息失败！");
				}
			},
			error : function() {
				alert("失败！");
			}
		});
	}
	function showInfo(data){
		$("#regular_grade").val(data.score);
		if(!data.one.sum){
			data.one.sum = 0;
		}
		if(!data.much.sum){
			data.much.sum = 0;
		}
		if(!data.judge.sum){
			data.judge.sum = 0;
		}
		if(!data.solution.sum){
			data.solution.sum = 0;
		}
		$("#one").html(data.one.sum);
		$("#much").html(data.much.sum);
		$("#judge").html(data.judge.sum);
		$("#solution").html(data.solution.sum);
		if(!data.one.score){
			data.one.score = 0;
		}
		if(!data.much.score){
			data.much.score = 0;
		}
		if(!data.judge.score){
			data.judge.score = 0;
		}
		if(!data.solution.score){
			data.solution.score = 0;
		}
		
		$("#type_1").val(data.one.score);
		$("#type_2").val(data.much.score);
		$("#type_3").val(data.judge.score);
		$("#type_4").val(data.solution.score);
		
		$("#score1").html(data.one.sum * data.one.score);
		$("#score2").html(data.much.sum * data.much.score);
		$("#score3").html(data.judge.sum * data.judge.score);
		$("#score4").html(data.solution.sum * data.solution.score);
		$("#allscore").html(data.one.sum * data.one.score+data.much.sum * data.much.score+data.judge.sum * data.judge.score+data.solution.sum * data.solution.score);
	}
	function save(callback){
		var score = $("#regular_grade").val();
		if(!score){
			alert("请填写合格成绩！");
			return;
		}
		var score1 = $("#type_1").val();
		if(score1==0 && $("#one").html()!=0){
			alert("请填写单选题分值！");
			return;
		}
		var score2 = $("#type_2").val();
		if(score2==0 && $("#much").html()!=0){
			alert("请填写多选题分值！");
			return;
		}
		var score3 = $("#type_3").val();
		if(score3==0 && $("#judge").html()!=0){
			alert("请填写判断题分值！");
			return;
		}
		var score4 = $("#type_4").val();
		if(score4==0 && $("#solution").html()!=0){
			alert("请填写解答题分值！");
			return;
		}
		var allScore = $("#allscore").html();
		var map= new Object;
		map.score1 = score1;
		map.score2 = score2;
		map.score3 = score3;
		map.score4 = score4;
		map.score = score;
		map.allScore = allScore;
		var jsonData = JSON.stringify(map);
		var url = rootPath + "/testPaper/updateTest/" + paperId;
		$.ajax({
			url : url,
			method : "post",
			dataType : "json",
			data : {'data':jsonData},
			success : function(data) {
				if (data) {
					top.commonTools.showTip("操作成功！", 1);
					if(callback){
						callback();
					}else{
						parent.status1();
						parent.reloadList();
					}
				} else {
					top.commonTools.showTip("操作失败！", 2);
				}
			},
			error : function() {
				alert("失败！");
			}
		});
	}
	
	function submit(){
		var url = rootPath + "/testPaper/submit";
		$.ajax({
			url : url,
			method : "post",
			dataType : "json",
			data : {'data':paperId},
			success : function(data) {
				if (data) {
					top.commonTools.showTip("等待评估！", 1);
					parent.status1();
					parent.reloadList();
				} else {
					//alert("保存失败！");
				}
			},
			error : function() {
				alert("失败！");
			}
		});
	}
</script>
</html>